<template>
	<view class="container" style="display: flex;flex-direction: column;">
		<view class="top" style="width: 710rpx;height: 76rpx;background-color: #FFF;padding-top: 10rpx;padding-left: 20rpx;padding-right: 20rpx;">
			<u-search placeholder="请输入商家名称" v-model="shopName" @search='search' @custom='search'></u-search>
		</view>
		<view style="display: flex;flex-direction: column;">
			<view v-for="(item, index2) in dataList" :key='index2'>
				<shopCell :row='item' @click="shopHandle" @callAction="operateAction('call', item)"></shopCell>	
			</view>	
		</view>
		<view style="padding-top: 300rpx;" v-if='showEmpty'>
			<u-empty text="暂无数据" mode="list"></u-empty>
		</view>
	</view>
</template>

<script>
	import { shop } from '@/api/shop.js'
	import shopCell from "@/components/shopCell/shopCell.vue"
	export default{
		components: { shopCell },
		data() {
			return {
				page: 1,
				size: 20,
				dataList: [],
				showEmpty: false,
				isLastPage: false,
				shopName: ''
			}
		},
		onLoad() {
			this.getDataList()
		},
		onPullDownRefresh() {
			this.page = 1
			this.getDataList()
		},
		onReachBottom() {
			if(this.isLastPage) {
				return
			}
			this.getDataList()
		},
		methods:{
			search(){
				this.page = 1
				this.getDataList()
			},
			shopHandle(item){
				this.$Router.push({
					name: 'shopDetail',
					params: {
						shopId: item.id
					}
				})
			},
			operateAction(scene, val) {
				console.log('事件', scene, val)
				switch (scene) {
					case 'call':
						uni.makePhoneCall({
							phoneNumber: val.phone, // 电话号码
							success: function () {
							  console.log('拨打电话成功');
							},
							fail: function () {
							  console.log('拨打电话失败');
							}
						})
						break;
					default:
						break;
				}
			},
			getDataList() {
				var params = {
					page: this.page,
					size: this.size,
					status: 1,
					name: this.shopName
				}
				if (this.$Route.query){
					params = Object.assign(params, this.$Route.query)
				}
				shop.getShopForCList(params).then(res => {
					uni.stopPullDownRefresh();
					if (res.data.code == 10000) {
						if(this.page == 1){
							this.dataList = []
						}
						var list = res.data.data.list
						this.dataList = [...this.dataList, ...list]
						this.showEmpty = this.dataList.length<1
						if (res.data.data.next) {
							this.page += 1
						} else {
							this.isLastPage = true
						}
					}
				})
			},
		}
	}
</script>


<style scoped lang="scss">
	
</style>